<template> 
  <div> 
    <head-top head-title="行车主要指标" go-back='true'></head-top>                
      <el-table    :data='driveKpi'  element-loading-text='给我一点时间' border fit highlight-current-row>
        <el-table-column  label='线别' prop="lineName" width="80">
        </el-table-column>
        <el-table-column  label='运行图' prop="runChartCode" width="80">
        </el-table-column>
        <el-table-column  label='计划开行' prop="jhkx" width="50">
        </el-table-column>
        <el-table-column  label='实际开行' prop="sjkx"  width="50">
        </el-table-column>
        <el-table-column  label='加开' prop="lsjkzk" width="50">
        </el-table-column>
        <el-table-column  label='兑现率' prop="yxtdx_avg" width="70">
        </el-table-column>
       </el-table> 
        <br/> 
        <br/> 
       <el-table  :data='driveKpi'   element-loading-text='给我一点时间' border fit highlight-current-row >
        <el-table-column  label='晚点' prop="wd" width="130">
        </el-table-column>
        <el-table-column  label='正点率' prop="lczdl_avg" width="130">
        </el-table-column>
        <el-table-column  label='最大行车间隔' prop="zdxc_ms" width="120">
        </el-table-column>
       </el-table>  
       <br/> 
       <br/> 
       <el-table  :data='driveKpi'  element-loading-text='给我一点时间' border fit highlight-current-row >
        <el-table-column  label='清客' prop="qx_mon" width="100">
        </el-table-column>
        <el-table-column  label='抽线' prop="cx_mon" width="90">
        </el-table-column>
        <el-table-column  label='下线' prop="xx_mon" width="90">
        </el-table-column>
         <el-table-column  label='运营里程' prop="yylc" width="100">
        </el-table-column>
       </el-table>  
 
    <!--  <x-table :cell-bordered="false"   :data='driveKpi'  style="background-color:#fff;">
        <thead>
          <tr class="class_table_tr"> 
            <th>'线别'</th>
            <th>运行图</th>
            <th>计划开行</th>
            <th>实际开行</th>
            <th>加开</th>
            <th>兑现率</th>          
          </tr>           
        </thead>
       
        <tbody>
          <tr>
            <td>123</td>
            <td></td>  
            <td></td>
            <td></td>
            <td></td>
            <td></td>                       
          </tr>                 
        </tbody>  
      </x-table>
     
     <br/> 
      <x-table :cell-bordered="false" style="background-color:#fff;">
        <thead>
          <tr class="class_table_tr">         
            <th>晚点</th>
            <th>正点率</th>
            <th>最大行车间隔</th>
          </tr>
        </thead>
        <tbody>
          <tr>          
            <td>1号线</td>
            <td>2号线</td>
            <td>2号线</td>
          </tr>
          <tr>        
            <td>1号线</td>
            <td>2号线</td>
            <td>2号线</td>
          </tr>
        </tbody>
      </x-table>
      <br/>
      <x-table :cell-bordered="false" style="background-color:#fff;">
        <thead>
          <tr class="class_table_tr"> 
            <th>清客</th>
            <th>抽线</th>
            <th>下线</th>
            <th>运营里程</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td>1号线</td>
            <td>2号线</td>  
            <td>1号线</td>
            <td>2号线</td>
          </tr>
          <tr>
           <td>1号线</td>
            <td>2号线</td>  
            <td>1号线</td>
            <td>2号线</td>
          </tr>
          <tr>
            <td>1号线</td>
            <td>2号线</td>  
            <td>1号线</td>
            <td>2号线</td>
          </tr>
          <tr>
            <td>1号线</td>
            <td>2号线</td>  
            <td>1号线</td>
            <td>2号线</td>
          </tr>
          <tr>
            <td>1号线</td>
            <td>2号线</td>  
            <td>1号线</td>
            <td>2号线</td>
          </tr>
          <tr>
            <td>1号线</td>
            <td>2号线</td>  
            <td>1号线</td>
            <td>2号线</td>
          </tr> <tr>
            <td>1号线</td>
            <td>2号线</td>  
            <td>1号线</td>
            <td>2号线</td>
          </tr>
          <tr>
            <td>1号线</td>
            <td>2号线</td>  
            <td>1号线</td>
            <td>2号线</td>
          </tr>
          <tr>
            <td>1号线</td>
            <td>2号线</td>  
            <td>1号线</td>
            <td>2号线</td>
          </tr> <tr>
            <td>1号线</td>
            <td>2号线</td>  
            <td>1号线</td>
            <td>2号线</td>
          </tr>
          <tr>
            <td>1号线</td>
            <td>2号线</td>  
            <td>1号线</td>
            <td>2号线</td>
          </tr>
          <tr>
            <td>1号线</td>
            <td>2号线</td>  
            <td>1号线</td>
            <td>2号线</td>
          </tr>
        </tbody>
      </x-table> --> 
  </div>  
  
</template>
<script>
  import { Scroller } from 'vux'
  import headTop from "src/components/head";
  import { XTable, LoadMore } from 'vux'
  import vue from "vue";
  export default{
    components:{
      headTop, XTable,LoadMore,Scroller
    },
    data() {
      return {
      detail:null,
      driveKpi:[] 
    };
    },
    created(){
      this.detail=this.$store.state.detail;//将数据从内存$store中取出    
      this.driveKpi=this.detail.driveKpi; //获取其中的 driveKpi数据  
    },
    methods: {
    
     

  }
};
</script>
<style>

.class_table{
     background-color:#fff;
     align-self: center;
     align-content: center;
     overflow:scroll;
}
.class_table_tr{
     background-color:rgb(17, 133, 179);
     align-self: center;
     align-content: center;
}
</style>
